/*
 * @Author: pengyong
 * @Date: 2021-03-12 21:58:00
 * @LastEditors: pengyong
 * @LastEditTime: 2021-03-12 22:24:18
 * @Description: 用户信息
 * @FilePath: /supplier_app/screens/UserInfoScreen.js
 */
import React, {Component} from 'react';
import {
  SafeAreaView,
  ImageBackground,
  StyleSheet,
  ScrollView,
  View,
  Text,
  StatusBar,
  TextInput,
} from 'react-native';

import {ListItem, Button, Icon, Avatar} from 'react-native-elements';
import {Actions} from 'react-native-router-flux';
import AsyncStorage from '@react-native-community/async-storage';

import Api from '../Api';
import AvatarIcon from '../assets/avatar.png';

export default class UserInfo extends Component {
  constructor(props) {
    super(props);
    this.state = {
      user: {},
      userInfo: {}
    };
  }

  componentDidMount() {
    AsyncStorage.getItem('@loginUser').then(data => {
      const loginUser = JSON.parse(data);
      this.setState({
        user: loginUser.user,
      });
    });
    Api.getUserInfo().then(res => {
      console.log(res)
      this.setState({
        userInfo: res
      })
    })
  }
  render() {
    const {user, userInfo} = this.state;
    return (
      <SafeAreaView style={{flex: 1}}>
        <ListItem bottomDivider containerStyle={styles.reverse}>
          {user.avatar ? (
            <Avatar source={{uri: user.avatar}} />
          ) : (
            <Avatar source={AvatarIcon} rounded />
          )}
          <ListItem.Content>
            <ListItem.Title>头像</ListItem.Title>
          </ListItem.Content>
        </ListItem>
        <ListItem
          bottomDivider
          containerStyle={[styles.reverse, styles.container]}>
          <Text>{userInfo.personName || '-'}</Text>
          <ListItem.Content>
            <ListItem.Title>姓名</ListItem.Title>
          </ListItem.Content>
        </ListItem>
        <ListItem
          bottomDivider
          containerStyle={[styles.reverse, styles.container]}>
          <Text>{userInfo.account || '-'}</Text>
          <ListItem.Content>
            <ListItem.Title>账号</ListItem.Title>
          </ListItem.Content>
        </ListItem>
        {/* <ListItem
          bottomDivider
          containerStyle={[styles.reverse, styles.container]}>
          <Text>{user.email || '-'}</Text>
          <ListItem.Content>
            <ListItem.Title>email</ListItem.Title>
          </ListItem.Content>
        </ListItem> */}
        <ListItem
          bottomDivider
          containerStyle={[styles.reverse, styles.container]}>
          <Text>{user.phone || '-'}</Text>
          <ListItem.Content>
            <ListItem.Title>电话</ListItem.Title>
          </ListItem.Content>
        </ListItem>
        {/* <ListItem
          bottomDivider
          containerStyle={[styles.reverse, styles.container]}>
          <Text>{user.dept || '-'}</Text>
          <ListItem.Content>
            <ListItem.Title>部门</ListItem.Title>
          </ListItem.Content>
        </ListItem> */}
        <ListItem
          bottomDivider
          containerStyle={[styles.reverse, styles.container]}>
          <Text>{userInfo.province ? `${userInfo.province}${userInfo.city}${userInfo.county}` : '-'}</Text>
          <ListItem.Content>
            <ListItem.Title>地区</ListItem.Title>
          </ListItem.Content>
        </ListItem>
        <ListItem
          bottomDivider
          containerStyle={[styles.reverse, styles.container]}>
          <Text>{userInfo.major || '-'}</Text>
          <ListItem.Content>
            <ListItem.Title>类别</ListItem.Title>
          </ListItem.Content>
        </ListItem>
        <ListItem
          bottomDivider
          containerStyle={[styles.reverse, styles.container]}>
          <Text>{userInfo.level || '-'}</Text>
          <ListItem.Content>
            <ListItem.Title>等级</ListItem.Title>
          </ListItem.Content>
        </ListItem>
         <ListItem
          bottomDivider
          containerStyle={[styles.reverse, styles.container]}>
          <Text>{user.ownerName || '-'}</Text>
          <ListItem.Content>
            <ListItem.Title>所属供应商</ListItem.Title>
          </ListItem.Content>
        </ListItem>
      </SafeAreaView>
    );
  }
}

const styles = StyleSheet.create({
  reverse: {
    flexDirection: 'row-reverse',
  },
  container: {
    paddingVertical: 20,
  },
});
